﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Regla3Simpleal//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Regla3Simpleal.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>ContainerSliderContainer Test</title>
    
    <!--<link href="Regla3Simple.css" rel="stylesheet" type="text/css" />-->
    <script src="../Common/IndustrialDashboard.js" type="text/javascript"></script>
    <script src="../Common/Common.js" type="text/javascript"></script>
    <script src="../Common/ParseAttributes.js" type="text/javascript"></script>
    <!--<script src="Regla3Simple.js" type="text/javascript"></script>-->

    <style type="text/css">
        
        .VerticalSection {
        	position:relative;
        	float:left;
        	padding:0;
        	margin:0;
        	top:0;
        	left:0;
        	width:25%;
        	height:100%;
        	display:inline-block;
        }
        
    </style>

    <script language="javascript" type="text/javascript">

        var WREF = {};
        WREF.HeightValueTBX = null;
        WREF.HeightOldValueTBX = null;
        WREF.HeightNewValueTBX = null;
        WREF.HeightOldDefault = 282;
        WREF.HeightNewDefault = 640;
//        WREF.ResultContainer = null;
        WREF.WidthValueTBX = null;
        WREF.WidthOldValueTBX = null;
        WREF.WidthNewValueTBX = null;
        WREF.WidthOldDefault = 240;
        WREF.WidthNewDefault = 480;

        WREF.Reset = function Reset() {
            WREF.HeightValueTBX.value = "";
            WREF.WidthValueTBX.value = "";
        };

        WREF.FixedValuesTextbox_KeyDown = function FixedValuesTextbox_KeyDown(e) {
            var evt = (typeof(e) != "undefined") ? e : window.event;
            var target = ((typeof(e) != "undefined") && (e.target)) ? e.target : window.event.srcElement;

            if(evt.keyCode == 13)
            {
                target.Data.TargetTBX.focus();
            }
            else
            {
                WREF.Reset();
            }
        };
        WREF.Textbox_Focus = function Textbox_Focus(e) {
            var target = ((typeof(e) != "undefined") && (e.target)) ? e.target : window.event.srcElement;

            target.select();
        };
        WREF.ValueTexbox_KeyDown = function ValueTexbox_KeyDown(e) {
            var evt = (typeof(e) != "undefined") ? e : window.event;
            var target = ((typeof(e) != "undefined") && (e.target)) ? e.target : window.event.srcElement;

            if(evt.keyCode == 13)
            {
                alert(target.Data.Legend + (parseFloat(target.value) * parseFloat(target.Data.NewValueTBX.value) / parseFloat(target.Data.OldValueTBX.value)).toString());

                target.focus();
            }
        };

        attachDomReadyEventHandler(function () {

            WREF.HeightOldValueTBX = document.getElementById("HeightOldValueTBX");
            WREF.HeightOldValueTBX.type = "text";
            WREF.HeightOldValueTBX.value = WREF.HeightOldDefault;
            addEventHandler(WREF.HeightOldValueTBX, "onkeydown", WREF.FixedValuesTextbox_KeyDown);
            addEventHandler(WREF.HeightOldValueTBX, "onfocus", WREF.Textbox_Focus);

            WREF.HeightNewValueTBX = document.getElementById("HeightNewValueTBX");
            WREF.HeightNewValueTBX.type = "text";
            WREF.HeightNewValueTBX.value = WREF.HeightNewDefault;
            addEventHandler(WREF.HeightNewValueTBX, "onkeydown", WREF.FixedValuesTextbox_KeyDown);
            addEventHandler(WREF.HeightNewValueTBX, "onfocus", WREF.Textbox_Focus);

            WREF.HeightValueTBX = document.getElementById("HeightValueTBX");
            WREF.HeightValueTBX.type = "text";
            WREF.HeightValueTBX.Data = {
                Legend: "Heigth: "
                , OldValueTBX: WREF.HeightOldValueTBX
                , NewValueTBX: WREF.HeightNewValueTBX
            };
            addEventHandler(WREF.HeightValueTBX, "onkeydown", WREF.ValueTexbox_KeyDown);
            addEventHandler(WREF.HeightValueTBX, "onfocus", WREF.Textbox_Focus);

            WREF.HeightOldValueTBX.Data = {
                TargetTBX: WREF.HeightValueTBX
            };
            WREF.HeightNewValueTBX.Data = {
                TargetTBX: WREF.HeightValueTBX
            };

            WREF.WidthOldValueTBX = document.getElementById("WidthOldValueTBX");
            WREF.WidthOldValueTBX.type = "text";
            WREF.WidthOldValueTBX.value = WREF.WidthOldDefault;
            addEventHandler(WREF.WidthOldValueTBX, "onkeydown", WREF.FixedValuesTextbox_KeyDown);
            addEventHandler(WREF.WidthOldValueTBX, "onfocus", WREF.Textbox_Focus);

            WREF.WidthNewValueTBX = document.getElementById("WidthNewValueTBX");
            WREF.WidthNewValueTBX.type = "text";
            WREF.WidthNewValueTBX.value = WREF.WidthNewDefault;
            addEventHandler(WREF.WidthNewValueTBX, "onkeydown", WREF.FixedValuesTextbox_KeyDown);
            addEventHandler(WREF.WidthNewValueTBX, "onfocus", WREF.Textbox_Focus);

            WREF.WidthValueTBX = document.getElementById("WidthValueTBX");
            WREF.WidthValueTBX.type = "text";
            WREF.WidthValueTBX.Data = {
                Legend: "Width: "
                , OldValueTBX: WREF.WidthOldValueTBX
                , NewValueTBX: WREF.WidthNewValueTBX
            };
            addEventHandler(WREF.WidthValueTBX, "onkeydown", WREF.ValueTexbox_KeyDown);
            addEventHandler(WREF.WidthValueTBX, "onfocus", WREF.Textbox_Focus);

            WREF.WidthOldValueTBX.Data = {
                TargetTBX: WREF.WidthValueTBX
            };
            WREF.WidthNewValueTBX.Data = {
                TargetTBX: WREF.WidthValueTBX
            };

            WREF.WidthValueTBX.focus();
        });

    </script>
</head>

<body style="position:fixed;height:100%;width:100%;text-align:center;">
    <div class="VerticalSection">
        <p>Height Old:</p>
        <input id="HeightOldValueTBX" style="position:relative;height:30px;width:200px;" />
        <p>Width Old:</p>
        <input id="WidthOldValueTBX" style="position:relative;height:30px;width:200px;" />
    </div>
    <div class="VerticalSection">
        <p>Height New:</p>
        <input id="HeightNewValueTBX" style="position:relative;height:30px;width:200px;" />
        <p>Width New:</p>
        <input id="WidthNewValueTBX" style="position:relative;height:30px;width:200px;" />
    </div>
    <div class="VerticalSection">
        <p>Height:</p>
        <input id="HeightValueTBX" style="position:relative;height:30px;width:200px;" />
        <p>Width:</p>
        <input id="WidthValueTBX" style="position:relative;height:30px;width:200px;" />
    </div>
    <div class="VerticalSection">
      
    </div>
</body>

</html>